<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>个人资料</title>
</head>

<body>
    <div class="app_personal">
        <div class="top dpflex">
            <i class="iconfont icon-vprev returnmine"></i>
            <p>个人资料</p>
        </div>

        <ul class="list">
            <li>
                <p>更换头像</p>
                <div>
                    <input type="file" id="file">
                    <img src="../imgs/cat.jpg" alt="" class="userimg">
                </div>
            </li>
        </ul>
        <!-- 用户名 -->
        <div class="weui-cell weui-cell_active">
            <div class="weui-cell__hd"><label class="weui-label">昵称</label></div>
            <div class="weui-cell__bd weui-flex">
                <input class="weui-input" type="text" id="nickname" />
            </div>
        </div>
        <!-- 性别 -->
        <div class="weui-cell weui-cell_active weui-cell_access" id="showgenderPicker">
            <div class="weui-cell__bd">性别</div>
            <div class="weui-cell__ft" id="gender">未选择</div>
        </div>
        <!-- 生日 -->
        <div class="weui-cell weui-cell_active weui-cell_access" id="showbirthdayPicker">
            <div class="weui-cell__bd">生日</div>
            <div class="weui-cell__ft" id="birthday">未选择</div>
        </div>
        <!-- 城市 -->
        <div class="weui-cell weui-cell_active weui-cell_access" id="showaddressPicker">
            <div class="weui-cell__bd">城市</div>
            <div class="weui-cell__ft" id="address">未选择</div>
        </div>
        <!-- 个性签名 -->
        <div class="weui-cell weui-cell_active">
            <div class="weui-cell__hd"><label class="weui-label">个性签名</label></div>
            <div class="weui-cell__bd weui-flex">
                <input class="weui-input" type="text" id="signature" />
            </div>
        </div>

        <!-- 文本域 -->
        <div class="weui-cells__title">问题描述</div>
        <div class="weui-cells weui-cells_form">
            <div class="weui-cell ">
                <div class="weui-cell__bd">
                    <textarea class="weui-textarea" placeholder="请描述你所发生的问题" rows="3"></textarea>
                    <div class="weui-textarea-counter"><span id="text">0</span>/20</div>
                </div>
            </div>
        </div>
        <p class="save">保存信息</p>            

        <!-- 提示信息 -->
        <div id="toast" style="display: none;">
            <div class="weui-mask_transparent"></div>
            <div class="weui-toast">
                <i class="weui-icon-success-no-circle weui-icon_toast"></i>
                <p class="weui-toast__content">已完成</p>
            </div>
        </div>
</body>

</html>